import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:fzcgx_app/common/adapter_utils.dart';
import 'package:fzcgx_app/provider/provider_widget.dart';



import 'package:fzcgx_app/ui/register/view_model/register_view_model.dart';

class RegisterPage extends StatefulWidget {
  RegisterPage({Key key}) : super(key: key);

  @override
  _RegisterPageState createState() => _RegisterPageState();
}

class _RegisterPageState extends State<RegisterPage> {
  // ignore: unused_field
  RegisterViewModel _viewModel;
  @override
  void initState() {
    _viewModel = RegisterViewModel();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
          child: ProviderWidget<RegisterViewModel>(
              model: _viewModel,
              builder: (context, model, child) {
                return Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    
                    InkWell(
                      onTap: () {
                        Navigator.pop(context);
                      },
                      child: Padding(
                        padding:
                            EdgeInsets.only(left: AdapterUtils.getWidth(22),right:  AdapterUtils.getWidth(22),top:AdapterUtils.getHeight(15), ),
                        child: Image.asset(
                          'assets/images/back.png',
                        ),
                      ),
                    ),
                    SizedBox(
                      height: AdapterUtils.getHeight(10),
                    ),
                    Expanded(
                        child: SingleChildScrollView(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          SizedBox(
                            height: AdapterUtils.getHeight(44),
                          ),
                          Container(
                              padding: EdgeInsets.only(
                                  left: AdapterUtils.getWidth(48)),
                              child: Text(
                                '欢迎来到',
                                style: TextStyle(
                                  fontSize: AdapterUtils.getSp(15),
                                  color: Color(0xff666666),
                                  fontWeight: FontWeight.w500,
                                ),
                              )),
                          SizedBox(
                            height: AdapterUtils.getHeight(4),
                          ),
                          Container(
                              padding: EdgeInsets.only(
                                  left: AdapterUtils.getWidth(48)),
                              child: Text('美策科技',
                                  style: TextStyle(
                                    fontSize: AdapterUtils.getSp(28),
                                    color: Color(0xff000000),
                                    fontWeight: FontWeight.w600,
                                  ))),
                          SizedBox(
                            height: AdapterUtils.getHeight(57),
                          ),
                          Container(
                            margin: EdgeInsets.symmetric(
                                horizontal: AdapterUtils.getWidth(50)),
                            padding: EdgeInsets.only(
                                bottom: AdapterUtils.getHeight(10)),
                            decoration: BoxDecoration(
                                border: Border(
                                    bottom: BorderSide(
                                        color: Color(0xffcccccc), width: 1))),
                            child: Row(
                              children: <Widget>[
                                Text(
                                  '+86',
                                  style: TextStyle(
                                      fontWeight: FontWeight.bold,
                                      color: Color(0xff000000),
                                      fontSize: AdapterUtils.getSp(16)),
                                ),
                                SizedBox(
                                  width: AdapterUtils.getWidth(15),
                                ),
                                Container(
                                  height: AdapterUtils.getHeight(19),
                                  width: 1,
                                  color: Color(0xffcccccc),
                                ),
                                SizedBox(
                                  width: AdapterUtils.getWidth(15),
                                ),
                                Expanded(
                                  child: TextField(
                                    controller: model.phoneControll,
                                    keyboardType: TextInputType.phone,
                                    onChanged: (value) {
                                      model.onChanged();
                                    },
                                    style: TextStyle(
                                      fontSize: AdapterUtils.getSp(16),
                                      color: Color(0xff000000),
                                      fontWeight: FontWeight.w500,
                                    ),
                                    decoration: InputDecoration(
                                        hintText: '输入手机号',
                                        border: InputBorder.none,
                                        hintStyle: TextStyle(
                                          fontSize: AdapterUtils.getSp(16),
                                          color: Color(0xffcccccc),
                                          fontWeight: FontWeight.w500,
                                        )),
                                  ),
                                ),
                                Offstage(
                                  offstage: model.phoneControll.text
                                          .toString()
                                          .isEmpty
                                      ? true
                                      : false,
                                  child: GestureDetector(
                                    onTap: () {
                                      model.clearPhoneText();
                                    },
                                    child: Container(
                                      width: AdapterUtils.getWidth(45),
                                      height: AdapterUtils.getHeight(45),
                                      child: Icon(
                                        Icons.cancel,
                                        color: Color(0xffc2c2c2),
                                        size: 17,
                                      ),
                                    ),
                                  ),
                                )
                              ],
                            ),
                          ),
                          SizedBox(
                            height: AdapterUtils.getHeight(20),
                          ),
                          Container(
                            margin: EdgeInsets.symmetric(
                                horizontal: AdapterUtils.getWidth(50)),
                            padding: EdgeInsets.only(
                                bottom: AdapterUtils.getHeight(10)),
                            decoration: BoxDecoration(
                                border: Border(
                                    bottom: BorderSide(
                                        color: Color(0xffcccccc), width: 1))),
                            child: Row(
                              children: <Widget>[
                                Expanded(
                                  child: TextField(
                                    controller: model.pswControll,
                                    keyboardType: TextInputType.phone,
                                    obscureText: model.pswObscureText,
                                    onChanged: (value) {
                                      _viewModel.onChanged();
                                    },
                                    style: TextStyle(
                                      fontSize: AdapterUtils.getSp(16),
                                      color: Color(0xff000000),
                                      fontWeight: FontWeight.w500,
                                    ),
                                    decoration: InputDecoration(
                                        hintText: '设置密码（6-16位数字和字母组合）',
                                        border: InputBorder.none,
                                        hintStyle: TextStyle(
                                          fontSize: AdapterUtils.getSp(16),
                                          color: Color(0xffcccccc),
                                          fontWeight: FontWeight.w500,
                                        )),
                                  ),
                                ),
                                Offstage(
                                  offstage:
                                      model.pswControll.text.toString().isEmpty
                                          ? true
                                          : false,
                                  child: GestureDetector(
                                    onTap: () {
                                      model.clearPswText();
                                    },
                                    child: Container(
                                      width: AdapterUtils.getWidth(45),
                                      height: AdapterUtils.getHeight(45),
                                      child: Icon(
                                        Icons.cancel,
                                        color: Color(0xffc2c2c2),
                                        size: 17,
                                      ),
                                    ),
                                  ),
                                ),
                                Offstage(
                                  offstage:
                                      model.pswControll.text.toString().isEmpty
                                          ? true
                                          : false,
                                  child: GestureDetector(
                                    onTap: () {
                                      model.onPswObscureText();
                                    },
                                    child: Container(
                                        child: Image.asset(
                                            'assets/images/eye.png')),
                                  ),
                                )
                              ],
                            ),
                          ),
                          SizedBox(
                            height: AdapterUtils.getHeight(20),
                          ),
                          Container(
                            margin: EdgeInsets.symmetric(
                                horizontal: AdapterUtils.getWidth(50)),
                            padding: EdgeInsets.only(
                                bottom: AdapterUtils.getHeight(10)),
                            decoration: BoxDecoration(
                                border: Border(
                                    bottom: BorderSide(
                                        color: Color(0xffcccccc), width: 1))),
                            child: Row(
                              children: <Widget>[
                                Expanded(
                                  child: TextField(
                                    controller: model.codeControll,
                                    keyboardType: TextInputType.phone,
                                    
                                    onChanged: (value) {
                                      _viewModel.onChanged();
                                    },
                                    style: TextStyle(
                                      fontSize: AdapterUtils.getSp(16),
                                      color: Color(0xff000000),
                                      fontWeight: FontWeight.w500,
                                    ),
                                    decoration: InputDecoration(
                                        hintText: '输入验证码',
                                        border: InputBorder.none,
                                        hintStyle: TextStyle(
                                          fontSize: AdapterUtils.getSp(16),
                                          color: Color(0xffcccccc),
                                          fontWeight: FontWeight.w500,
                                        )),
                                  ),
                                ),
                                Offstage(
                                  offstage:
                                      model.codeControll.text.toString().isEmpty
                                          ? true
                                          : false,
                                  child: GestureDetector(
                                    onTap: () {
                                      model.clearCodeText();
                                    },
                                    child: Container(
                                      width: AdapterUtils.getWidth(45),
                                      height: AdapterUtils.getHeight(45),
                                      child: Icon(
                                        Icons.cancel,
                                        color: Color(0xffc2c2c2),
                                        size: 17,
                                      ),
                                    ),
                                  ),
                                ),
                                InkWell(
                                  onTap: (){
                                    if(_viewModel.timerCountDown.isActive()){
                                         return;
                                    }
                                    _viewModel.startTimerCountDown();
                                  },
                                  child: Text(
                                   _viewModel.timerCountDown.isActive()?'(${_viewModel.timeCount}s）重新获取': '获取验证码',
                                    style: TextStyle(
                                      fontSize: AdapterUtils.getSp(14),
                                      color: _viewModel.timerCountDown.isActive()?Color(0xff99A2AD): Color(0xff15A1FF),
                                      fontWeight: FontWeight.w500,
                                    ),
                                  ),
                                )
                              ],
                            ),
                          ),
                          SizedBox(
                            height: AdapterUtils.getHeight(20),
                          ),
                          Container(
                            margin: EdgeInsets.symmetric(
                                horizontal: AdapterUtils.getWidth(50)),
                            padding: EdgeInsets.only(
                                bottom: AdapterUtils.getHeight(10)),
                            decoration: BoxDecoration(
                                border: Border(
                                    bottom: BorderSide(
                                        color: Color(0xffcccccc), width: 1))),
                            child: Row(
                              children: <Widget>[
                                Expanded(
                                  child: TextField(
                                    controller: model.invitationCodeControll,
                                    keyboardType: TextInputType.phone,
                                    
                                    onChanged: (value) {
                                      _viewModel.onChanged();
                                    },
                                    style: TextStyle(
                                      fontSize: AdapterUtils.getSp(16),
                                      color: Color(0xff000000),
                                      fontWeight: FontWeight.w500,
                                    ),
                                    decoration: InputDecoration(
                                        hintText: '邀请码（选填）',
                                        border: InputBorder.none,
                                        hintStyle: TextStyle(
                                          fontSize: AdapterUtils.getSp(16),
                                          color: Color(0xffcccccc),
                                          fontWeight: FontWeight.w500,
                                        )),
                                  ),
                                ),
                                Offstage(
                                  offstage:
                                      model.invitationCodeControll.text.toString().isEmpty
                                          ? true
                                          : false,
                                  child: GestureDetector(
                                    onTap: () {
                                      model.clearInvitationCodeText();
                                    },
                                    child: Container(
                                      width: AdapterUtils.getWidth(45),
                                      height: AdapterUtils.getHeight(45),
                                      child: Icon(
                                        Icons.cancel,
                                        color: Color(0xffc2c2c2),
                                        size: 17,
                                      ),
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                          SizedBox(
                            height: AdapterUtils.getHeight(40),
                          ),
                          Container(
                              margin: EdgeInsets.symmetric(
                                  horizontal: AdapterUtils.getWidth(50)),
                              child: RichText(
                                text: TextSpan(
                                    style: DefaultTextStyle.of(context).style,
                                    children: <InlineSpan>[
                                      TextSpan(
                                        text: '注册代表您已同意美策科技 ',
                                        style: TextStyle(
                                          fontSize: AdapterUtils.getSp(13),
                                          color: Color(0xff99A2AD),
                                          fontWeight: FontWeight.w500,
                                        ),
                                        
                                      ),
                                      TextSpan(
                                          text: '《用户注册须知》',
                                          style: TextStyle(
                                            fontSize: AdapterUtils.getSp(13),
                                            color: Color(0xff15A1FF),
                                            fontWeight: FontWeight.w500,
                                            decoration:
                                                TextDecoration.underline,
                                          ),recognizer: TapGestureRecognizer()
                                          ..onTap = () {},),
                                    ]),
                              )),
                          SizedBox(
                            height: AdapterUtils.getHeight(10),
                          ),
                          Container(
                              margin: EdgeInsets.symmetric(
                                  horizontal: AdapterUtils.getWidth(50)),
                              width: AdapterUtils.screenWidth(),
                              height: AdapterUtils.getHeight(48),
                              child: FlatButton(
                                  onPressed: model.isInput ? () {
                                    model.onRegister(context);
                                   // Routes.navigateTo(context, SelectTypePage());
                                  } : null,
                                  disabledColor:
                                      Color(0xff15A1FF).withAlpha(80),
                                  color: Color(0xff15A1FF),
                                  shape: RoundedRectangleBorder(
                                    borderRadius:
                                        BorderRadius.all(Radius.circular(4)),
                                  ),
                                  child: Text(
                                    '下一步',
                                    style: TextStyle(
                                      fontSize: AdapterUtils.getSp(16),
                                      color: Colors.white,
                                      fontWeight: FontWeight.w500,
                                    ),
                                  ))),
                          SizedBox(
                            height: AdapterUtils.getHeight(25),
                          ),
                          Container(
                            alignment: Alignment.center,
                              margin: EdgeInsets.symmetric(
                                  horizontal: AdapterUtils.getWidth(50)),
                              child: RichText(
                                text: TextSpan(
                                    style: DefaultTextStyle.of(context).style,
                                    children: <InlineSpan>[
                                      TextSpan(
                                        text: '已有账号？',
                                        style: TextStyle(
                                          fontSize: AdapterUtils.getSp(14),
                                          color: Color(0xff666666),
                                          fontWeight: FontWeight.w500,
                                        ),
                                        
                                      ),
                                      TextSpan(
                                          text: '登录',
                                          style: TextStyle(
                                            fontSize: AdapterUtils.getSp(14),
                                            color: Color(0xff15A1FF),
                                            fontWeight: FontWeight.w500,
                                            
                                          ),recognizer: TapGestureRecognizer()
                                          ..onTap = () {
                                            Navigator.pop(context);
                                          },),
                                    ]),
                              )),
                               SizedBox(
                            height: AdapterUtils.getHeight(35),
                          ),
                        ],
                      ),
                    ))
                  ],
                );
              })),
    );
  }
  @override
  void dispose() {
    _viewModel.timerCountDown.cancel();
    super.dispose();
  }
}
